<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8"/>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"/>
		<meta name="HandheldFriendly" content="true"/>
		<meta name="MobileOptimized" content="320"/>
		<title>Search Input</title>
		<script type="text/javascript" src="../js/common.js"></script>
		<link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8"/>
		<script>
var ws = null;
// H5 plus事件处理
function plusReady(){
	ws = plus.webview.currentWebview();
	ws.addEventListener('titleNViewSearchInputChanged', function(e){
		console.log('titleNViewSearchInputChanged: '+JSON.stringify(e));
		document.getElementById('search').innerText = e.text;
	}, false);
	ws.addEventListener('titleNViewSearchInputConfirmed', function(e){
		console.log('titleNViewSearchInputConfirmed: '+JSON.stringify(e));
		doSearch(e.text);
	}, false);
	ws.addEventListener('titleNViewSearchInputFocusChanged', function(e){
		console.log('titleNViewSearchInputFocusChanged: '+JSON.stringify(e));
	}, false);
}
document.addEventListener('plusready', plusReady, false);

// 更新搜索文本
var bText = false;
function changeText(){
	var t = bText?'':'修改后的搜索文本';
	bText = !bText;
	ws.setTitleNViewSearchInputText(t);
}

// 获取搜索文本
function getText(){
	console.log('searchInput: '+ws.getTitleNViewSearchInputText());
}

// 执行搜索操作
var wbaidu = null;
function doSearch(txt){
	if(wbaidu){	// 避免快速点击打开
		return;
	}
	var url = 'https://m.baidu.com/s?word='+txt;
	wbaidu = plus.webview.create('https://m.baidu.com/s?word='+txt, 'baidu', {
		backButtonAutoControl: 'close',
		popGesture: 'close',
		progress: {
			color: '#00CC00',
			height: '3px'
		},
		titleNView: {
			autoBackButton: true,
			backgroundColor: '#D74B28',
			titleText: txt,
			titleColor: '#CCCCCC'
		}
	});
	wbaidu.addEventListener('close', function(e){
		wbaidu = false;
		ws.setTitleNViewSearchInputFocus(true);
	}, false);
	ws.setTitleNViewSearchInputFocus(false);
	wbaidu.show('pop-in');
}
		</script>
	</head>
	<body>
		<br/>
		<p>搜索示例页面</p>
		<br>
		<div class="button" onclick="changeText()">修改搜索文本</div>
		<div class="button" onclick="getText()">获取搜索文本</div>
		<br/>
		<p style="color:#FF0000;" id="search"></p>
		<br/>
	</body>
</html>
